<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- public quote -->
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- jqgrid-->
<link href="${basePath}/css/plugins/jqgriddemo/css/ui.jqgrid-bootstrap.min.css" rel="stylesheet" />
<!-- zTreeStyle.css -->
<link rel="stylesheet" type="text/css" href="${basePath}/css/zTreeStyle/zTreeStyle/zTreeStyle.css">
<!doctype html>
<html>
<head></head>
<body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight creditbody">
		 <div class="iboxtitle">
			<span><i class="glyphicon glyphicon-map-marker"></i>&nbsp;系统管理&gt;权限管理&gt;角色管理</span>
			<a href="javascript:void(0)"></a>
		</div>
         <div class="ibox-content">
               <button type="button" class="btn dpbtn_green" onclick="add();">新增</button> 
               <button type="button" class="btn dpbtn_blue" onclick="disable();">禁用</button> 
               <button type="button" class="btn dpbtn_red" onclick="enable();">启用</button> 
               <button type="button" class="btn dpbtn_red" onclick="del();">删除</button> 
               <button type="button" class="btn dpbtn_grey_default" onclick="branchRole();">分配菜单(PC)</button>
               <button type="button" class="btn dpbtn_grey_default" onclick="branchAppRole();">分配菜单(APP)</button>  
          </div>
          <div class="ibox-content">
               <div role="form" class="form-inline">
                   <div class="form-group">
                       <label for="loginName" class="sr-only">角色名</label>
                       <input type="text" placeholder="请输角色名称" id="loginName" class="form-control">
                   </div>
                   <button class="zhixcx" type="button" onclick="query();">查询角色</button>
               </div>
          </div>
          <div class="ibox-content">	
	          	<div class="jqGrid_wrapper">
		             <table id="table_list_1"></table>
		             <div id="pager_list_1"></div>
	         	</div>
          </div>
	</div>
	
	
	<!-- public quote -->
    <%@include file="/jsp/comm_js_include.jsp"%>

	<!-- jqGrid -->
    <script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/jquery.jqGrid.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/grid.locale-cn.min.js"></script>	
    
	<!--zTreeStyle.js-->
	<script type="text/javascript" src="${basePath}/js/zTreeStyle/jquery.ztree.core.js" charset="utf-8"></script>
	<script type="text/javascript" src="${basePath}/js/zTreeStyle/jquery.ztree.excheck.js" charset="utf-8"></script>
    <!--
    	作者：zhangpp
    	时间：2017-04-06
    	描述：js
    -->
    <script type="text/javascript">
	    jQuery(function($) {  
	    	getData();
	    });
	    
	    var updateLayer;
	    var getData = function()
	    {
	  var winWidth = $('div.ibox-content').width();
	   	    winHeight = document.body.offsetHeight - 400;
  		   var win = winWidth / 7 - 20;
  		
  	 	   $.jgrid.defaults.styleUI = 'Bootstrap';
  	 	   
		  jQuery("#table_list_1").jqGrid
		  ({
			url:'${basePath}/role/getList',
	        datatype : "json",
	        colNames : [ '主键',  '角色名称','角色代码', '新建人姓名', '新建时间','修改人姓名','修改时间','备注','状态'],
	        colModel : [ 
						 {name: 'replaceId', index: 'id', hidden:true},
	                     {name: 'roleName',index: 'roleName',width: 100,align: "center"},
	            		 {name: 'roleCode',index: 'roleCode',width: 100,align: "center"},
						 {name: 'creatorName',index: 'creatorName',width: 100,align: "center"},
	                     {name: 'created',index: 'created',width: 100,align: "center",
	                    	 formatter:'date', formatoptions: {srcformat: 'U', newformat:'Y-m-d'}
						 },
	               		 {name: 'modifierName',index: 'modifierName',width: 80,align: "center"},
	            		 {name: 'modified',index: 'modified',width: 100,align: "center",
	            			 formatter:'date', formatoptions: {srcformat: 'U', newformat:'Y-m-d'}
	               		 },
	            		 {name: 'remarks',index: 'remarks',width: 80,align: "center"},
	            		 {name: 'dpStatus',index: 'dpStatus',width: 80,align: "center",
	            			 formatter: function (cellvalue, options, rowObject) 
	            			 {
	            				 if(cellvalue == 1)
	            				 {
	            					 return '<span style="color: green;">正常</span>';
	            				 }
	            				 
	            				 if(cellvalue == "2")
	            				 {
	            					 return '<span style="color:#FC1515;">禁用</span>';
	            				 }
	            			 }	 
	            		 } 
	                   ],
              mtype : "post",
              height: winHeight,
              width:winWidth,  
              autowidth: true,
              shrinkToFit: true,
              rowNum: 15,
              sortorder : "desc",
              sortname : 'created',
              rowList: [15, 30, 45],
              viewrecords: true,
              pager: "#pager_list_1",
              hidegrid: false,
              multiselect : true,
              altRows:true,
              altclass:'someClass',
              ondblClickRow:function(rowId,v,e)
              {
            	  var rowData = $("#table_list_1").jqGrid("getRowData", rowId);
            	  var id = rowData.replaceId;
            	  updateLayer =  layer.open({
    		    	  type: 2,
    		    	  title: '修改用户',
    		    	  shadeClose: true,
    		    	  shade: 0.8,
    		    	  area: ['500px', '50%'],
    		    	  content: 'roleUpdate.jsp?uid='+id,
    		    	  end: function () 
    		    	  {
    		    		  refresh();
    		          }
    	    	});  	  
              },
              jsonReader : {
            	  root:"result.rows",
            	  page: "result.page",
            	  total: "result.total",
            	  records: "result.records",
            	  repeatitems: false,
            	  id: "replaceId" 
              },
              loadComplete:function(datas){
	         	  if (datas.flag == "100100") {
	                   layer.msg("查询成功!", {icon: 6, time: 1000});
	                   return;
	               }
	         	  if(datas.flag == '100802') {
	 				  top.location.href = thisLoginUrl;
	 				  return;
	 			  }

	         	  layer.msg(datas.message, {icon: 2});
	           }
	      });
	    }	    
	    
	    window.onresize = function()
	    {
	    	$("#table_list_1").setGridWidth($(window).width()-80);
	    }
	    
	    //角色搜索
	    var query = function()
	    {
	    	var postData = $("#table_list_1").jqGrid("getGridParam", "postData");
	    	var loginName = document.getElementById('loginName').value || '';
	    	$.extend(postData, { roleName : loginName.trim() });
	    	refresh();
	    }
	    
	    
	    //菜单分配
	    
	    var index = 0;
	    
	    var branchRole = function()
	    {
	    	var rowData = jQuery('#table_list_1').jqGrid('getGridParam','selarrrow');  
	    	if(rowData.length < 1)
	    	{  
	    		layer.msg("请选择要分配的用户数据！", {icon: 5});
				return;
	    	}
	    	
	    	if(rowData.length > 1)
	    	{
	    		layer.msg("只能选择一个角色分配！", {icon: 5});
	    		
				return;
	    	}
	    	
			var roleId = $('#table_list_1').jqGrid('getGridParam','selarrrow').join(",");
			
			$.dpAjax({
	    		url:'${basePath}/power/queryTree',
    			data:{
    				"roleId":roleId
    			},
    			success: function(datas){
	    			  if(datas.flag == "100100")
					  {
	    				  var content = '<div class="ibox-content" style="height: 280px;border: 1px solid #F5F5F6; overflow:auto;overflow-x: hidden;">'
		    					+ '	<div id="treeDemo" class="ztree">&nbsp;</div>'
		    				+ '</div>'
		    				+ '<div class="ibox-content">'
		    				+ '	 <button class="btn dpbtn_green" type="button" onclick="confirmRole();">确定</button>'
		    				+ '	 <button class="btn dpbtn_red" type="button" onclick="cancelRole();">取消</button>'
		    				+ '</div>';
		    		
					    	index = layer.open({
						    	  title:'分配菜单列表',
						    	  type: 1,
						    	  area: ['500px', '400px'], //宽高
						    	  content: content
						    });
					    				
						    var setting = {
									check: {
										enable: true
									},
									data: {
										simpleData: {
											enable: true
										}
									}
						    };
						    var result = datas.result;
					        for(var i=0; i<result.length;i++){
					    	  if(result[i].powerCode == 'diepu:base'){
					    		  result[i].open = true;
					    	  }else {
					    		  result[i].open = false; 
	     					  }
						    }
						    var zNodes = datas.result;
	    				    $.fn.zTree.init($("#treeDemo"), setting, zNodes);
						    return;
					  }
					  if(datas.flag == "100200")
	                  {
						  $.fn.showDatas({"datas":datas});
	                	  return;
	                  }
					  layer.msg(datas.message, {icon: 2});
                }
	    	});
	    }
	    
	    
	    
	    
	    var cancelRole = function()
	    {
	    	layer.close(index);
	    }

	    
	    var confirmRole = function()
	    {
	    	 var zTree = $.fn.zTree.getZTreeObj("treeDemo"); 
	    	 
	    	 var nodes = zTree.getCheckedNodes(true);
	    	 
	    	 if(nodes.length == 0) {
	    		 layer.msg("请选择要分配的菜单数据！", {icon: 5});
				 return;
	    	 }
	    	 
	    	 var powerId = "";
	    	 
	    	 for(var i=0;i<nodes.length;i++) {
	    		 powerId += nodes[i].id + ",";
	    	 }
	    	 
	    	 if(powerId != "")
	    	 {
	    		 powerId = powerId.substring(0,powerId.length-1);
	    	 }
	    	 var rowData = jQuery('#table_list_1').jqGrid('getGridParam','selarrrow');  
		     if(rowData.length < 1){return;}
	    	 var roleId = $('#table_list_1').jqGrid('getGridParam','selarrrow').join(",");
 
    		 $.dpAjax({
 	    		url:'${basePath}/role/allot',
     			data:{
     				"roleId":roleId,
     				"functionId":powerId
     			},
     			success: function(datas){
     			  if(datas.flag == "100100")
 					  {
     				 	  layer.msg("分配菜单执行成功！", {icon: 6});
     				 	  layer.close(index);
 						  return;
 					  }
 					  if(datas.flag == "100200")
 	                  {
 						  $.fn.showDatas({"datas":datas});
 	                	  return;
 	                  }
 					  layer.msg(datas.message, {icon: 2});
                 }
 	    	});
	    }
	    
	    
	    //App分配菜单
	    var branchAppRole = function()
	    {
	    	var rowData = jQuery('#table_list_1').jqGrid('getGridParam','selarrrow');  
	    	if(rowData.length < 1)
	    	{  
	    		layer.msg("请选择要分配的用户数据！", {icon: 5});
				return;
	    	}
	    	
	    	if(rowData.length > 1)
	    	{
	    		layer.msg("只能选择一个角色分配！", {icon: 5});
	    		
				return;
	    	}
	    	
			var roleId = $('#table_list_1').jqGrid('getGridParam','selarrrow').join(",");
			
			$.dpAjax({
	    		url:'${basePath}/appMenu/queryTree',
    			data:{
    				"roleId":roleId
    			},
    			success: function(datas){
    				var content = '<div class="ibox-content" style="height: 280px;border: 1px solid #F5F5F6; overflow:auto;overflow-x: hidden;">'
    					+ '	<div id="treeDemoApp" class="ztree">&nbsp;</div>'
    				+ '</div>'
    				+ '<div class="ibox-content">'
    				+ '	 <button class="btn dpbtn_green" type="button" onclick="confirmAppRole();">确定</button>'
    				+ '	 <button class="btn dpbtn_red" type="button" onclick="cancelRole();">取消</button>'
    				+ '</div>';
    		
			    	index = layer.open({
				    	  title:'分配菜单列表',
				    	  type: 1,
				    	  area: ['500px', '400px'], //宽高
				    	  content: content
				    });
			    				
				    var setting = {
							check: {
								enable: true
							},
							data: {
								simpleData: {
									enable: true
								}
							}
				    };
				    var result = datas.result;
			        for(var i=0; i<result.length;i++){
			    	  if(result[i].menuCode == 'diepu:base'){
			    		  result[i].open = true;
			    	  }else {
			    		  result[i].open = false;
 					  }
				    }
				    var zNodes = datas.result;
				    
				    $.fn.zTree.init($("#treeDemoApp"), setting, zNodes);
				    
				    return;
    			}  
	    	});
	    }
	    
	    
	    var confirmAppRole = function()
	    {
	    	 var zTree = $.fn.zTree.getZTreeObj("treeDemoApp"); 
	    	 
	    	 var nodes = zTree.getCheckedNodes(true);
	    	 
	    	 if(nodes.length == 0) {
	    		 layer.msg("请选择要分配的菜单数据！", {icon: 5});
				 return;
	    	 }
	    	 
	    	 var powerId = "";
	    	 var menuCode = "";
	    	 
	    	 for(var i=0;i<nodes.length;i++) {
	    		 powerId += nodes[i].id + ",";
	    		 menuCode += nodes[i].code + ",";
	    	 }
	    	 
	    	 if(powerId != "") {
	    		 powerId = powerId.substring(0,powerId.length-1);
	    		 menuCode = menuCode.substring(0,menuCode.length-1);
	    	 }
	    	 var rowData = jQuery('#table_list_1').jqGrid('getGridParam','selarrrow');  
		     if(rowData.length < 1){return;}
	    	 var roleId = $('#table_list_1').jqGrid('getGridParam','selarrrow').join(",");
 
    		 $.dpAjax({
 	    		url:'${basePath}/role/appAllot',
     			data:{
     				"roleId":roleId,
     				"appMenuId":powerId,
     				"appMenuCode":menuCode
     			},
     			success: function(datas){
     				  layer.msg("分配菜单执行成功！", {icon: 6});
				 	  layer.close(index);
					  return;
                 }
 	    	});
	    }
	    
	    //角色新增
	    var addlayer;
	    
	    var add = function()
	    {
	       
	    	addlayer=layer.open({
		    	  type: 2,
		    	  title: '新增角色',
		    	  shadeClose: true,
		    	  shade: 0.8,
		    	  area: ['500px', '50%'],
		    	  content: 'roleAdd.jsp',
		    	  end: function () 
		    	  {
		    		  refresh();
		          }
	    	});
	    }
	    
	    
	    //角色删除
	    var del = function()
	    {
	    	
	    	var uid = $('#table_list_1').jqGrid('getGridParam','selarrrow').join(",");
	    	if(uid == "" || null == uid)
	    	{
	    		layer.msg("请选择要删除的用户！", {icon: 5});
	    		return;
	    	}
	    	
	    	var uuid = uid.split(",");
	    	
	    	var b = false;
	    	
	    	for(var i=0;i<uuid.length;i++)
	    	{
	    		if(uuid[i] == 1)
	    		{
		    		b = true;
		    		break;
	    		}
	    	}
	    	
	    	if(b)
	    	{
	    		layer.msg("超级管理员不可以删除！", {icon: 5});
	    		return;
	    	}
	    	
	    	layer.confirm('您确认要删除吗？', {
  			  btn: ['确定','取消'],//按钮
	    	  title: '删除消息',
  			},function(){
  				layer.closeAll();
  				$.dpAjax({
  	 	    		url:'${basePath}/role/del',
  	     			data:{
  	     				"id":uid
  	     			},
  	     			success: function(datas){
  	     			  if(datas.flag == "100100")
  	 					  {
  	     				 	  layer.msg("删除执行成功！", {icon: 6});
  	     				 	  refresh();
  	 						  return;
  	 					  }
  	 					  if(datas.flag == "100200")
  	 	                  {
  	 						  $.fn.showDatas({"datas":datas});
  	 	                	  return;
  	 	                  }
  	 					  layer.msg(datas.message, {icon: 2});
  	                 }
  	 	    	});
  			});
	    }
	    
	    
	    
	    //角色禁用
	    var disable = function()
	    {
	    	var rowData = jQuery('#table_list_1').jqGrid('getGridParam','selarrrow');  
	    	if(rowData.length < 1)
	    	{  
	    		layer.msg("请选择禁用的用户信息！", {icon: 5});
				return;
	    	}
	    	
	    	var uid = $('#table_list_1').jqGrid('getGridParam','selarrrow').join(",");
	    	
	    	var uuid = uid.split(",");
	    	
	    	var b = false;
	    	
	    	for(var i=0;i<uuid.length;i++)
	    	{
	    		if(uuid[i] == 1)
	    		{
	    			b = true;
	    			break;
	    		}
	    	}
	    	
	    	if(b)
	    	{
	    		layer.msg("超级管理员不可禁用！", {icon: 5});
	    		return;
	    	}
	    	
	    	for(var i=0;i<rowData.length;i++)
	    	{
	    		var dpStatus = jQuery('#table_list_1').jqGrid('getCell',rowData[i],'dpStatus'); 
	    	   	if(dpStatus != '<span style="color: green;">正常</span>')
	    	   	{
	    	   		layer.msg("已经禁用的用户不可再次执行！", {icon: 5});
		    		return;
	    	   	}
	    	} 
	    	
	    	
	    	layer.confirm('您确认要禁用吗？', {
	  			  btn: ['确定','取消'] //按钮
  			},function(){
  				layer.closeAll();
  				$.dpAjax({
  	 	    		url:'${basePath}/role/disable',
  	     			data:{
  	     				"id":uid
  	     			},
  	     			success: function(datas){
  	     			  if(datas.flag == "100100")
  	 					  {	  
  	     				 	  layer.msg("禁用执行成功！", {icon: 6});
  	     				 	  refresh();
  	 						  return;
  	 					  }
  	 					  if(datas.flag == "100200")
  	 	                  {
  	 						  $.fn.showDatas({"datas":datas});
  	 	                	  return;
  	 	                  }
  	 					  layer.msg(datas.message, {icon: 2});
  	                 }
  	 	    	});
  				
  			});
	    }
	    
	    
	    //角色启用
	    var enable = function()
	    {
	    	var rowData = jQuery('#table_list_1').jqGrid('getGridParam','selarrrow');  
	    	if(rowData.length < 1)
	    	{  
	    		layer.msg("请选择启用的用户信息！", {icon: 5});
				return;
	    	}
	    	
	    	var uid = $('#table_list_1').jqGrid('getGridParam','selarrrow').join(",");
	    	
	    	var uuid = uid.split(",");
	    	
	    	var b = false;
	    	
	    	for(var i=0;i<uuid.length;i++)
	    	{
	    		if(uuid[i] == 1)
	    		{
	    			b = true;
	    			break;
	    		}
	    	}
	    	
	    	if(b)
	    	{
	    		layer.msg("超级管理员不可再次启用！", {icon: 5});
	    		return;
	    	}
	    	
	    	for(var i=0;i<rowData.length;i++)
	    	{
	    		var dpStatus = jQuery('#table_list_1').jqGrid('getCell',rowData[i],'dpStatus'); 
	    	   	if(dpStatus == '<span style="color: green;">正常</span>')
	    	   	{
	    	   		layer.msg("已经启用的用户不可再次执行！", {icon: 5});
		    		return;
	    	   	}
	    	} 
	    	
	    	layer.confirm('您确认要启用吗？', {
	  			  btn: ['确定','取消'] //按钮
			},function(){
				layer.closeAll();
				$.dpAjax({
	 	    		url:'${basePath}/role/enable',
	     			data:{
	     				"id":uid
	     			},
	     			success: function(datas){
	     			  if(datas.flag == "100100")
	 					  {	  
	     				 	  layer.msg("启用执行成功！", {icon: 6});
	     				 	  refresh();
	 						  return;
	 					  }
	 					  if(datas.flag == "100200")
	 	                  {
	 						  $.fn.showDatas({"datas":datas});
	 	                	  return;
	 	                  }
	 					  layer.msg(datas.message, {icon: 2});
	                 }
	 	    	});
				
			});
	    	
	    }

	   
	    var refresh = function()
	    {
	    	$("#table_list_1").jqGrid("setGridParam", { search: true }).trigger("reloadGrid");
	    }
	    
    </script>
</body>
</html>
